<template>
   <div id="homeA">
     <h3>{{mag}}</h3>
     <p>父组件传来的信息：{{inputMsg}}</p>
     <input v-model="homeAMsg" type="text"/><button @click="sendMsg">传给父元素</button> <br/>
     <p>homeB组件传来的信息：{{homeBMsg}}</p>
   </div>
</template>
<script>
  import VueEvent from './VueEvent'

  export default{
      props:["inputMsg"],
      data(){
          return {
              mag:"我是home的子组件homeA",
              homeAMsg:"",
              homeBMsg:""
          }
      },
      mounted(){
          //接收homeB组件的广播数据
         VueEvent.$on("to_homeA",data=>{
             this.homeBMsg = data;
         });
      },
      methods:{
        sendMsg(){
           this.$emit("fromHomeAMsg",this.homeAMsg);
        }
      }
  }
</script>
<style lang="scss">
  #homeA{
    width: 50%;
    height: 200px;
    outline: solid 0.5px grey;
  }
</style>
